<!--按钮区域-->
<template>
  <div class="home">
    <div class="btnArea clearfix">
      <span>
        <a href="">包月续费</a>
      </span>
      <span>
        <a href="">查看特权</a>
      </span>
    </div>
  </div>
</template>

<script>
  export default {
    data () {
      return {
        msg: '13213'
      }
    }
  }
</script>


<style>
  .btnArea span{
    width: 160px;
    height: 63px;
    float:left;
    background: #fff;
    margin-bottom: 14px;
  }
  .btnArea span:nth-child(1) a{
    color:#333;
    float:right;
    padding-right: 28px;
    margin-top:19.5px ;
  }
  .btnArea span:nth-child(1) a:before{
    content: "";
    float: left;
    display: block;
    width: 16px;
    height: 18px;
    background: url(../../../../static/img/monthly/icon1.png) center no-repeat;
    background-size: cover;
    margin-right: 8px;
    margin-top: 2px;
  }
  .btnArea span:nth-child(2) a{
    float: left;
    padding-left: 28px;
    color:#333;
    margin-top:19.5px ;
    border-left: 1px solid  #a9a9a9;
  }
  .btnArea span:nth-child(2) a:before{
    content: "";
    float: left;
    display: block;
    width: 16px;
    height: 18px;
    background: url(../../../../static/img/monthly/icon2.png) center no-repeat;
    background-size: cover;
    margin-right: 8px;
    margin-top: 2px;
  }
 /* .btnArea span a:before{
    display: block;
    content:"";
    width: 16px;
    height: 18px;
    float:left;
    background: red;
  }*/
</style>
